Tengo un código en el fragmento que tiene document.getElementsByClassName("close")[0] , ¿qué está haciendo [0] ?
Nunca vi que se usaran corchetes en getElementsByClassName ¿para qué propósito se usa?
Además, ¿cómo puedo convertirlo a jQuery?
var modal = document.getElementById("myModal"); var btn = document.getElementById("myBtn"); var span = document.getElementsByClassName("close")[0]; btn.onclick = function() { modal.style.display = "block"; } span.onclick = function() { modal.style.display = "none"; } window.onclick = function(event) { if (event.target == modal) { modal.style.display = "none"; } } body {font-family: Arial, Helvetica, sans-serif;} .modal { display: none; position: fixed; z-index: 1; padding-top: 100px; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.4); } .modal-content { background-color: #fefefe; margin: auto; padding: 20px; border: 1px solid #888; width: 80%; } .close { color: #aaaaaa; float: right; font-size: 28px; font-weight: bold; } .close:hover, .close:focus { color: #000; text-decoration: none; cursor: pointer; } <h2>Modal </h2> <button id="myBtn">Open Modal</button> <div id="myModal" class="modal"> <div class="modal-content"> <span class="close">×</span> <p>Some text in the Modal..</p> </div> </div>document.getElementsByClassName devuelve un objeto de elementos similar a una matriz.
[0] toma el primer elemento de esa matriz.
Básicamente:
let elements = document.getElementsByClassName('close'); let span = elements[0];